@charset "UTF-8";
/*rem降级 */
html {
  font-size: 14.0625px; }

@media only screen and (min-width: 320px) and (max-width: 374px) {
  html {
    font-size: 12px !important; } }

@media only screen and (min-width: 375px) and (max-width: 413px) {
  html {
    font-size: 14.0625px !important; } }

@media only screen and (min-width: 414px) {
  html {
    font-size: 15.525px !important; } }

body {
  margin: 0;
  padding: 0;
  /*background: #f1f1f1;*/
  /*background-size: 100% auto;*/
  font-family: "Microsoft Yahei","Helvetica Neue", Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  -webkit-overflow-scrolling: touch; }

::-webkit-scrollbar {
  display: none; }

a, button, input, optgroup, select, textarea {
  -webkit-tap-highlight-color: transparent;
  font-family: "Microsoft Yahei","Helvetica Neue", Helvetica, sans-serif; }

a {
  text-decoration: none; }

ul, li, ol {
  list-style: none; }

em, i {
  font-style: normal; }

img {
  border: 0; }

div {
  box-sizing: border-box; }

button, input, select, textarea {
  outline: none; }

.flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  display: -moz-box; }

.flex-1 {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1; }

.clear {
  clear: both; }

.hidden {
  display: none; }

.show {
  display: block; }

.container {
  max-width: 1180px;
  margin: 0 auto;
  height: auto;
  overflow: hidden; }
  .container .top-bar > h1 {
    width: 80%;
    margin: 0 auto;
    text-align: center;
    font-size: 25px;
    margin-top: 22px; }
    .container .top-bar > h1 >a{
      float: right;
      color: gray;
      font-weight: normal;
      font-size: 16px;
      margin-left: 14px;
    }
  .container .top-bar .user-info {
    width: 800px;
    height: 40px;
    margin: 0 auto;
    text-align: center; }
    .container .top-bar .user-info .u-cell {
      display: inline-block;
      width: 300px;
      height: 40px;
      line-height: 40px;
      font-size: 18px;
      color: #999;
      font-weight: bold; }
      .container .top-bar .user-info .u-cell > span {
        color: black;
        font-weight: normal;
        text-decoration: underline; }
  .container .main {
    width: 80%;
    margin: 0 auto;
    box-sizing: border-box;
    padding-top: 30px;
    border-top: 1px dashed #333; }
    .container .main .result-wrap > h2 {
      font-weight: normal;
      font-size: 20px;
      margin-top: 2px; }
    .container .main .result-wrap .pass-rate-box {
      width: 194px;
      height: 254px;
      margin-left: 21px;
      margin-right: 21px;
      float: left; }
      .container .main .result-wrap .pass-rate-box .pass_rate {
        position: relative;
        width: 194px;
        height: 194px;
        border-radius: 50%;
        overflow: hidden;
        text-align: center; }
        .container .main .result-wrap .pass-rate-box .pass_rate canvas {
          position: absolute;
          z-index: 10;
          left: 0px;
          top: 0px;
          background: #eee;
          border-radius: 50%;
          -webkit-border-radius: 50%;
          -moz-border-radius: 50%; }
        .container .main .result-wrap .pass-rate-box .pass_rate .bor_bg {
          position: absolute;
          z-index: 100;
          background: #fff;
          margin: 20px;
          border-radius: 50%;
          width: 80%;
          height: 80%;
          overflow: hidden; }
          .container .main .result-wrap .pass-rate-box .pass_rate .bor_bg .toptitle {
            display: inline-block;
            font-size: 26px;
            margin-top: 28px; }
          .container .main .result-wrap .pass-rate-box .pass_rate .bor_bg .downnum {
            color: #41c7dd;
            display: inline-block;
            font-size: 42px;
            margin-top: 8px;
            overflow: hidden;
            width: 152px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap; }
      .container .main .result-wrap .pass-rate-box .pargram-rate-name {
        width: 194px;
        height: 40px;
        margin-top: 10px;
        line-height: 40px;
        font-size: 18px;
        color: #667180;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap; }
    .container .main .result-wrap .pass-loc {
      width: 640px;
      height: 254px;
      float: right;
      box-sizing: border-box;
      border: 1px dashed #bbb;
      padding-top: 30px; }
      .container .main .result-wrap .pass-loc .item {
        width: 100%;
        height: 50px;
        line-height: 50px; }
        .container .main .result-wrap .pass-loc .item .item-l {
          width: 20%;
          height: 50px;
          text-align: right;
          color: #333;
          font-size: 16px;
          float: left; }
        .container .main .result-wrap .pass-loc .item .item-r {
          width: 76%;
          height: 50px;
          font-size: 16px;
          float: right; }
          .container .main .result-wrap .pass-loc .item .item-r .color-bar {
            width: 400px;
            height: 30px;
            line-height: 30px;
            margin-top: 10px; }
            .container .main .result-wrap .pass-loc .item .item-r .color-bar .inner-bar {
              display: inline-block;
              min-width: 1%;
              width: 2%;
              max-width: 90%;
              height: 30px;
              background: #fbad28; }
            .container .main .result-wrap .pass-loc .item .item-r .color-bar > span {
              line-height: 30px;
              color: #fbad28;
              vertical-align: top; }
          .container .main .result-wrap .pass-loc .item .item-r .my .inner-bar {
            background: #9bdbf7; }
          .container .main .result-wrap .pass-loc .item .item-r .my > span {
            color: #9bdbf7; }
          .container .main .result-wrap .pass-loc .item .item-r .deg .inner-bar {
            background: #c9f2f6;
            width: 55%; }
          .container .main .result-wrap .pass-loc .item .item-r .deg > i {
            display: inline-block;
            width: 30px;
            height: 30px;
            line-height: 30px;
            background: orange;
            font-size: 16px;
            vertical-align: top;
            text-align: center;
            color: white; }
          .container .main .result-wrap .pass-loc .item .item-r .deg .d {
            background: #9fd7e8; }
          .container .main .result-wrap .pass-loc .item .item-r .deg .c {
            background: #71ceeb; }
          .container .main .result-wrap .pass-loc .item .item-r .deg .b {
            background: #3cb9eb; }
          .container .main .result-wrap .pass-loc .item .item-r .deg .a {
            background: #10a7e1; }
      .container .main .result-wrap .pass-loc > p {
        width: 90%;
        margin: 0 auto;
        margin-top: 14px; }
    .container .main .analyze-wrap {
      padding-top: 20px;
      padding-bottom: 20px; }
      .container .main .analyze-wrap > h2 {
        font-weight: normal;
        font-size: 20px;
        margin-top: 2px; }
      .container .main .analyze-wrap .ana-chart-warp {
        width: 100%;
        height: 240px; }
        .container .main .analyze-wrap .ana-chart-warp .ana-chart-cell {
          width: 24%;
          margin-right: 1%;
          height: 240px;
          box-sizing: border-box;
          float: left;
          border: 1px dashed #bbb; }
          .container .main .analyze-wrap .ana-chart-warp .ana-chart-cell .chart-cell {
            width: 100%;
            height: 210px; }
          .container .main .analyze-wrap .ana-chart-warp .ana-chart-cell .name {
            width: 100%;
            height: 30px;
            text-align: center;
            font-size: 16px;
            margin: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap; }
      .container .main .analyze-wrap .bottom-bar{
        width: 100%;
        height: 22px;
        padding-top: 10px;
        text-align: center;

      }
      .container .main .analyze-wrap .bottom-bar > span{
        margin-right: 20px;
      }
      .container .main .analyze-wrap .bottom-bar > span:before {
                  content: '';
                  width: 16px;
                  height: 16px;
                  display: inline-block;
                  margin-right: 8px;
                  vertical-align: -2px; }
      .container .main .analyze-wrap .bottom-bar  .my:before {
                background: #ffa9a2; }
      .container .main .analyze-wrap .bottom-bar  .middle:before {
                background: #8ee0ff; }
      .container .main .analyze-wrap .bottom-bar  .high:before {
                background: #b5e7b4; }

    .container .main .point-wrap {
      padding-top: 20px;
      padding-bottom: 40px; }
      .container .main .point-wrap > h2 {
        font-weight: normal;
        font-size: 20px;
        margin-top: 2px; }
      .container .main .point-wrap .chart {
        width: 60%;
        height: 300px;
        box-sizing: border-box;
        border: 1px dashed #aaa;
        float: left; }
        .container .main .point-wrap .chart .user-goal {
          width: 100%;
          height: auto;
          padding-left: 18px;
          padding-right: 30px;
          padding-bottom: 18px; }
          .container .main .point-wrap .chart .user-goal .goal-wrap {
            width: 100%;
            height: auto; }
            .container .main .point-wrap .chart .user-goal .goal-wrap .goal-title {
              width: 100%;
              color: #666973;
              height: 52px;
              font-size: 12px;
              line-height: 52px;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
              position: relative; }
              .container .main .point-wrap .chart .user-goal .goal-wrap .goal-title .set-goal {
                position: absolute;
                display: inline-block;
                font-size: 15px;
                color: #9f9f9f;
                right: 0; }
                .container .main .point-wrap .chart .user-goal .goal-wrap .goal-title .set-goal:before {
                  font-family: 'wfh_admin';
                  font-size: 16px;
                  content: '\e66f';
                  color: #9f9f9f;
                  margin-right: 8px; }
            .container .main .point-wrap .chart .user-goal .goal-wrap .goal-table {
              width: 100%;
              height: 173px; }
            .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips {
              width: 100%;
              height: 56px;
              line-height: 56px;
              font-size: 15px;
              color: #9f9f9f; }
              .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips > span {
                margin-right: 38px; }
                .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips > span:before {
                  content: '';
                  width: 16px;
                  height: 16px;
                  display: inline-block;
                  margin-right: 8px;
                  vertical-align: -2px; }
              .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips .goal:before {
                background: #8ee0ff; }
              .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips .done:before {
                background: #ffa9a2; }
              .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips .my-done:before {
                background: #b5e7b4; }
                .container .main .point-wrap .chart .user-goal .goal-wrap .goal-tips .arti:before {
                background: #fcb428; }
      .container .main .point-wrap .tips {
        width: 38%;
        height: 300px;
        box-sizing: border-box;
        float: right;
        padding: 50px 30px;
        background: url(../images/comeon.png) no-repeat;
        background-size: 40% 40%;
        background-position: right bottom; }
        .container .main .point-wrap .tips > p {
          line-height: 40px;
          font-size: 16px;
          text-align: center; }
          .container .main .point-wrap .tips > p > i {
            color: #fbad28;
            font-size: 18px; }


.email-mask{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,.6);
  z-index: 300;
  display: none;
}
.email-mask .email-dialog{
  width: 460px;
  height: 260px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -230px;
  margin-top: -130px;
  background: white;
  border-radius: 3px;
  background: white;
  overflow: hidden;
}
.email-mask .email-dialog >h1{
  width: 100%;
  height: 48px;
  line-height: 48px;
  font-size: 22px;
  text-align: center;
}
.email-mask .email-dialog .middle-bar{
  width: 90%;
  height: 50px;
  line-height: 50px;
  margin: 0 auto;
  text-align: center;
  margin-top: 12px;
  /*background: red;*/
}
.email-mask .email-dialog .middle-bar >span{
  font-size: 16px;
}
.email-mask .email-dialog .middle-bar >input{
  font-size: 16px;
}
.email-mask .email-dialog .btns{
  width: 80%;
  height: 40px;
  line-height: 40px;
  margin: 0 auto;
  text-align: center;
  margin-top: 24px;
}
.email-mask .email-dialog .btns >button{
  width: 118px;
  height: 38px;
  line-height: 38px;
  border-radius: 2px;
  background: white;
  border: 1px solid #aaa;
  font-size: 14px;
  cursor: pointer;
}